<template>
	<div class="paybox">
		<div class="paytitle">
			<p>确认付款</p>
			<h3>￥{{fkjine}}</h3>
		</div>
		<h3 class="payxztitle">请选择支付方式</h3>
		<ul class="paylist-box">
			<li class="pay-list" :class="{'yuebuzu':yuebz}" @click="!yuebz&&paytype(1)"><img src="../../img-pay/icon_yue@2x.png"/><div><p>余额支付</p><span>可用余额￥{{kyyue}}</span></div><span v-show="paystyle!=1"><img src="../../img-address/icon_dis@3x.png"/></span><span  v-show="paystyle==1"><img src="../../img-address/icon_select @3x.png"/></span></li>
			<li v-if="pdshow" class="pay-list pdd" :class="{'isweixin':!IsWc&&item.payment_code=='epaywxjs'}"  @click="paytype(item.payment_id,item.payment_code)" v-for="item in payments"><img :src="'http://www.ntyouxuan.com/'+item.img"/><div><p>{{item.payment_name}}</p></div><span v-show="paystyle!=item.payment_id"><img src="../../img-address/icon_dis@3x.png"/></span><span v-show="paystyle==item.payment_id"><img src="../../img-address/icon_select @3x.png"/></span></li>
		</ul>
		<div class="paybtn" @click="zhifuqueren()">确认支付</div>
		<form action="http://www.ntyouxuan.com/index.php?app=ajax_pay&act=pay_post" method="post" id="formid">
			<input type="text" value="" name="token" v-model="user">
			<input type="text" value="" name="payment_id" v-model="paystyle">
			<input type="text" value="" name="order_id" v-model="orderid">
		</form>
	</div>
</template>

<script>
	import payCss from '@/css/payview.css'
	
	var furl = 'http://www.ntyouxuan.com/';
	export default{
		name:'payrequet',
		data(){
			return{
				IsWc:true,
				paystyle:0,
				yuebz:true,
				user:0,
				orderid:0,
				payments:"",
				kyyue:0,
				fkjine:0,
				csshuju:"",
				mob_tel:true,
				pdshow:true
			}
		},
		created:function(){
			this.orderid=this.$route.query.ordertoken;
			this.user=this.$route.query.token;
			if(this.isWeiXin()){
				this.IsWc=true;
			}else{
				this.IsWc=false;
			}
			var self=this;
			$.ajax({
				type:"post",
				url:furl+"index.php?app=ajax_pay&act=pay",
				data:{'order_id':self.orderid,'token':self.user},
				dataType:"json",
				success:function(res){
					self.payments=res.retval.payments;
					self.fkjine=res.retval.order_info.order_amount;
					self.kyyue=res.retval.epay.money;
					if(self.fkjine == 0.00){
						self.pdshow = false
					}
					if(Number(res.retval.epay.money)<Number(res.retval.order_info.order_amount)){
						self.yuebz=true;
					}else{
						self.yuebz=false;
					}
					if(res.retval.phone_mob==''){
						self.mob_tel=false;
					}else{
						self.mob_tel=true;
					}
				}
			});
		},
		methods:{
			paytype:function(num,code){
				if(code=='epaywxjs'&&!this.IsWc){
					return;
				}else{
					this.paystyle=num;
				}
				
			},
			zhifuqueren:function(){
				var self=this;
				if(this.paystyle!=0){
					console.log(this.paystyle);
					if(this.paystyle!=1){
						document.getElementById("formid").submit();
					}else{
						if(self.mob_tel){
							this.$router.push({path:'/payrequet/paytel',query:{'token':self.user,'ordertoken':self.orderid}});
						}else{
							//跳到绑定手机号页面
						}
						
					}
				}
				
			},
			
			isWeiXin:function(){
			  //window.navigator.userAgent属性包含了浏览器类型、版本、操作系统类型、浏览器引擎类型等信息，这个属性可以用来判断浏览器类型
			  var ua = window.navigator.userAgent.toLowerCase();
			  //通过正则表达式匹配ua中是否含有MicroMessenger字符串
			  if(ua.match(/MicroMessenger/i) == 'micromessenger'){
			  return true;
			  }else{
			  return false;
			  }
			}
		}
	}
</script>

<style>
	.isweixin{opacity: 0.6;}
	.noweixin{opacity: 0.6;}
	.yuebuzu{opacity: 0.6;}
	#formid{height:0px;overflow: hidden;}
</style>